<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome to VN WEB</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.center.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<link rel="stylesheet" type="text/css" href="css/tabs.css"/>
<style>

</style>
<script language="JavaScript">
$(document).ready(function() {

    $(".tabs .tab[id^=tab_menu]").click(function() {
        var curMenu=$(this);
        $(".tabs .tab[id^=tab_menu]").removeClass("selected");
        curMenu.addClass("selected");

        var index=curMenu.attr("id").split("tab_menu_")[1];
        $(".curvedContainer .tabcontent").css("display","none");
        $(".curvedContainer #tab_content_" + index).css("display","block");
    });
});
</script>
</head>

<body>
<div id="wrapper">
	<div id="wrapperContent">
		<!-- Content -->
    	<div id="content">
			<!-- Dynamic content -->
        	<div id="dynamicContent">
            	<!-- Home -->
                <div id="home" class="noneDisplay">
                	
                </div>
                <!-- End of home -->
                
            	<!-- Instroduction -->
            	<div id="instroduction" class="noneDisplay">
                	<div>Chúng tôi là một nhóm các thành viên sáng tạo, ưu tú </div>
                    <div>cung cấp những giải pháp mới và đột phá nhằm tạo ra một kênh tiếp thị riêng đem đến giá trị cho bạn.</div>
                    <div>Chúng tôi cung cấp các giá trị cho bạn, chứ không phải chỉ dừng ở dịch vụ.</div>
                    <div>Từ nhưng trang Web độc đáo đến các ứng dụng hỗ trợ đa truyền thông cho doanh nghiệp (logo, banner ...).</div>
                    <div class="bold">Chúng tôi cam kết mang những ý tưởng trở thành thực tế và mang lại hiệu quả đầu tư thật sự.</div>
                </div>
                <!-- End of instroduction -->
                
				<!-- Service -->
                <div id="service" class="noneDisplay">
					<!-- tabscontainer -->
                	<div class="tabscontainer">
						<!-- tabs -->
						<div class="tabs">
							 <div class="tab selected" id="tab_menu_1">
								 <div id="banner-tab"></div>
							 </div>
							 <div class="tab" id="tab_menu_2">
								 <div id="cardvisit-tab"></div>
							 </div>
							 <div class="tab" id="tab_menu_3">
								 <div id="logo-tab"></div>
							 </div>
                             <div class="tab" id="tab_menu_4">
								 <div id="website-tab"></div>
							 </div>
						</div>
						<!-- end of tabs -->
						
						<!-- curvedContainer -->
						<div class="curvedContainer">
							<div class="tabcontent" id="tab_content_1" style="display:block;">
								<div class="service-text-logo bannerText"></div>
								<strong>JavaScript</strong>, also known as ECMAScript,[6] is a prototype-based, object-oriented[7] scripting language that is dynamic, weakly typed and has first-class functions. It is also considered a functional programming language[1] like Scheme and OCaml because it has closures and supports higher-order functions.[8]
                                <div class="line"></div>
                               	<div class="product">
                                	<div class="pro12 shadow"></div>
                                	<div class="pro21 shadow"></div>
                                    <div class="pro11 shadow"></div>
                                    <div class="pro11 shadow"></div>
                                    <div class="pro11 shadow"></div>
                                    <div class="pro21 shadow"></div>
                                    <div class="paging">
										<div class="first">&nbsp;</div>
                                        <div class="mid pointer" style="width: 70px;">TRƯỚC</div>
                                        <div class="mid" style="width: 224px;">
                                        	<div class="sep">&nbsp;</div>
                                            <div class="num activeNum pointer">1</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">2</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">3</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">4</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">5</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">6</div>
                                            <div class="sep pointer">&nbsp;</div>
                                        </div>
                                        <div class="mid pointer" style="width: 50px;">SAU</div>
                                        <div class="last">&nbsp;</div>
                                    </div>
                                </div>
                            </div>
							<div class="tabcontent" id="tab_content_2">
                            	<div class="service-text-logo cardVisitText"></div>
								<strong>Cascading Style Sheets (CSS)</strong> is a style sheet language used to describe the presentation semantics (the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.
							</div>
							<div class="tabcontent" id="tab_content_3">
                            	<div class="service-text-logo logoText"></div>
								<strong>jQuery</strong> is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML.[1] It was released in January 2006 at BarCamp NYC by John Resig. Used by over 43% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today.[2][3]
							</div>
                            <div class="tabcontent" id="tab_content_4">
                            	<div class="service-text-logo websiteText"></div>
								<strong>jQuery</strong> is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML.[1] It was released in January 2006 at BarCamp NYC by John Resig. Used by over 43% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today.[2][3]
                                <div class="line"></div>
                                <div class="website-tab">
                                	<div class="website-product shadow"></div>
                                	<div class="website-product shadow"></div>
                                    <div class="website-product shadow"></div>
                                    <div class="paging">
										<div class="first">&nbsp;</div>
                                        <div class="mid pointer" style="width: 70px;">TRƯỚC</div>
                                        <div class="mid" style="width: 224px;">
                                        	<div class="sep">&nbsp;</div>
                                            <div class="num activeNum pointer">1</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">2</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">3</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">4</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">5</div>
                                            <div class="sep">&nbsp;</div>
                                            <div class="num pointer">6</div>
                                            <div class="sep pointer">&nbsp;</div>
                                        </div>
                                        <div class="mid pointer" style="width: 50px;">SAU</div>
                                        <div class="last">&nbsp;</div>
                                    </div>
                                </div>
							</div>
						</div>
						<!-- end of curvedContainer -->
					</div>
					<!-- end of tabscontainer -->
                </div>
				<!-- End of Service -->
		                
                <!-- My group -->
                <div id="myGroup" class="noneDisplay">
                	<div id="designerImg1" onclick="showContent('designer1', members);"></div>
                    <div id="designerImg2" onclick="showContent('designer2', members);"></div>
                    <div id="marketingImg1" onclick="showContent('marketing1', members);"></div>
                    <div id="marketingImg2" onclick="showContent('marketing2', members);"></div>
                    <div id="proImg1" onclick="showContent('pro1', members);"></div>
                    <div id="proImg2" onclick="showContent('pro2', members);"></div>
                    <div id="proImg3" onclick="showContent('pro3', members);"></div>
                    <div id="proImg4" onclick="showContent('pro4', members);"></div>
                    
                	<div id="designer1" class="designer" style="display: none;">
               	    <div class="name textShadow">Trần Hoàng Thông</div>
                        <div class="designerProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="designer2" class="designer" style="display: none;">
                    	<div class="name textShadow">Huỳnh Nguyễn Trường Thy</div>
                        <div class="designerProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="marketing1" class="marketing" style="display: none;">
                    	<div class="name textShadow">Phan Quang Minh</div>
                        <div class="marketingProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="marketing2" class="marketing" style="display: none;">
                    	<div class="name textShadow">Đinh Hoài Anh</div>
                        <div class="marketingProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="pro1" class="pro" style="display: none;">
                    	<div class="name textShadow">Trương Anh Kiệt</div>
                        <div class="proProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="pro2" class="pro" style="display: none;">
                    	<div class="name textShadow">Ngô Thanh Long</div>
                        <div class="proProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="pro3" class="pro" style="display: none;">
                    	<div class="name textShadow">Ngô Thiên Ân Linh</div>
                        <div class="proProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                    <div id="pro4" class="pro" style="display: none;">
                    	<div class="name textShadow">Trần Nguyễn Minh Luân</div>
                        <div class="proProfile">
                        	Phụ trách thiết kế.<br/>
                        	Kinh nghiệm hai năm trong ngành thiết kế.<br/>
                            Tốt nghiệp Trung Tâm Polygon<br/>
                            thuộc trường Đại học Mỹ Thuật Tp. HCM
                        </div>
                    </div>
                </div>
                <!-- End of My group -->
                
                <!-- Contact -->
               	<div id="contact">
                	<div id="title1">LIÊN HỆ</div>
                    
                	<div class="left">&nbsp;</div>
					<div class="right"><strong>CÔNG TY CỔ PHẦN ĐỊA ĐIỂM</strong></div>
                    <div class="left clear">Trụ sở: </div>
                    <div class="right">Tổ 27A (gần 215B-33) Nguyễn Văn Hưởng, KP3, P. Thảo Điền, Q.2, Tp. HCM</div>
                    <div class="left clear" style="padding-top: 2px;">Điện thoại: </div>
                    <div class="right" style="padding-top: 2px;">(84-8) 37446616</div>
                    <div class="left clear" style="padding-top: 2px;">Fax: </div>
                    <div class="right" style="padding-top: 2px;">(84-8) 37446616</div>
                    <div class="left clear" style="padding-top: 2px;">Email: </div>
                    <div class="right" style="padding-top: 2px;">contact@mjgroup.vn, info@mfgroup.vn</div>
                    <div class="left clear" style="padding-top: 2px;">Website: </div>
                    <div class="right" style="padding-top: 2px;">http://www.diadiem.com</div>
                    
                    <div id="title2" class="clear">GỬI EMAIL CHO CHÚNG TÔI</div>
                    
                    <div id="contactForm">
                    	<div class="left" style="margin-top: 15px">Email nhận : </div>
                        <div class="right" style="margin-top: 10px"><input type="text" id="receiveEmail" value=""/></div>
                        <div class="left clear" style="margin-top: 18px">*Tên người gửi : </div>
                        <div class="right" style="margin-top: 14px"><input type="text" id="senderMail" value=""/></div>
                        <div class="left clear" style="margin-top: 19px">*Email người gửi : </div>
                        <div class="right" style="margin-top: 14px"><input type="text" id="senderName" value=""/></div>
                        <div class="left clear" style="margin-top: 19px">Dịch vụ bạn chọn : </div>
                        <div class="right">
                        	<div>
                                <span><input type="radio" name="service" id="website" checked="checked"/>Website</span>
                                <span><input type="radio" name="service" id="logo"/>Logo<br/><br/></span>
                                <span><input type="radio" name="service" id="banner"/>Banner</span>&nbsp;
                                <span><input type="radio" name="service" id="cardvisit"/>Card Visist</span>
                            </div>
                        </div>
                        <div style="z-index: 20; position: absolute; top: 214px;"><!-- fix bug: push menu -->
                            <div class="left clear" style="margin-top: 20px">Nội dung thông điệp : </div>
                            <div class="right" style="margin-top: 12px;"><textarea id="message"></textarea></div>
                            <div class="left clear">&nbsp;</div>
                            <div class="right">
                                <input type="submit" class="sendBtn" value="" />
                                <input type="reset" class="delBtn" value=""/>
                            </div>
                        </div>
					</div>
				</div>
                <!-- End of Contact -->
            </div>
			<!-- End of Dynamic content -->
        </div>
		<!-- Content -->
        <div id="icons">
        	<div class="browsersIcon"></div>
            <div class="homeIcon">
            	<a href=""><img src="images/home.png" /></a>
            	<a href=""><img src="images/facebook.png" /></a>     
            </div>
            <div class="brushesIcon"></div>
        </div>
        <div id="menu">
        	<ul id="navigation">
            	<li value="0"><a href="#home" onclick="showContent('home', menuItems);">TRANG CHỦ</a></li>
                <li value="1"><a href="#instroduction" onclick="showContent('instroduction', menuItems);">GIỚI THIỆU</a></li>
                <li value="2"><a href="#service" onclick="showContent('service', menuItems); changeBackground('content', '');">DỊCH VỤ</a></li>
                <li value="3"><a href="#mygroup" onclick="showContent('myGroup', menuItems);  changeBackground('content', ''); randomlySelectProfile();">NHÓM CHÚNG TÔI</a></li>
                <li value="4"><a href="#contact" onclick="showContent('contact', menuItems); changeBackground('content', '');">LIÊN HỆ</a></li>
            </ul>
        </div>
    </div>
</div>
</body>
</html>
